<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>

</body>

</html>

<!-- 
1.路由
1.1 路由routerlink to的赋值
1.2 redirect: *
1.3 this.$router.push('/home') 编程式导航
1.4 嵌套(一级路由 二级路由) children:[{path,component,}]
重要:步骤 6步

2.钩子函数
el data this.msg

3. vue-cli
npm i -g @vue/cli 
npm i -g  @vue/cli init
vue -V
vue init webpack-simple 项目名
cd heroes52
npm i
npm run dev (热更新 自动打开)

4. 英雄
4.1 导入素材 index.html index.css
a. npm i bootstrap@3.3.7
b. main.js 中 import './路径'
c..tff 修改webpack.config.json

4.2 提取公共头部AppHeader
4.3 提取侧边栏 AppSlider
4.4 提取列表 AppList
在App.vue中使用以上组件
a. 引入
b. components:{组件名:AppList}
c. tempalte <app-list>

4.5 提取路由模块
a. router.js
b. 导入vue 导入vue-router Vue.use(VueRouter)
c. 导入几个组件
d. 获取路由的实例化对象 / 配置路由
 =统一设置样式 active
e. 导出 export default router

4.6 在main.js 导入 router.js
> 选项 router:router

4.7 在AppSlider中设置routerlink
4.8 在App.vue template 设置了 router-view



-->